// src/components/hint.tsx
'use client';

import React from 'react';
import {Tooltip, TooltipContent, TooltipProvider, TooltipTrigger} from "@/components/ui/tooltip";

interface Props {
    label: string
    children: React.ReactNode
    side?: 'top' | 'right' | 'bottom' | 'left'
    align?: 'start' | 'end' | 'center'
}

const Hint = ({label, children, side, align}: Props) => {
    return (
        <TooltipProvider>
            {/*hover显示提示框*/}
            <Tooltip delayDuration={50}>
                <TooltipTrigger asChild>
                    {children}
                </TooltipTrigger>
                <TooltipContent
                    side={side} align={align}
                    className={`bg-black text-white border border-white/5`}>
                    <p>
                        {label}
                    </p>
                </TooltipContent>
            </Tooltip>
        </TooltipProvider>
    );
};

export default Hint;